﻿<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <script src="jquery-1.7.1.min.js" type="text/javascript"></script>
    <script src="knockout-2.1.0.js" type="text/javascript"></script>
</head>
<body>
    <p data-bind="with:lines">
        单价：<input type="text" data-bind='value:productPrice,  valueUpdate: "afterkeydown"' />
        数量：<input type="text" data-bind='visible:productPrice() > 0,value: productCount, valueUpdate: "afterkeydown"' />
        小计：<span data-bind="text:total"></span>
        <a data-bind='attr:{href:"/home/add/"+id,title:name}'>添加</a>
    </p>
    <script type="text/ecmascript">
        var product = function () {
            self = this;
            self.id = 1;
            self.name = "测试产品";
            self.productPrice = ko.observable(0);
            self.productCount = ko.observable(1);
            self.total = ko.computed(function () {

                return self.productCount() * self.productPrice();
            });
        }
        var products = function () {
            var self = this;
            self.lines = ko.observable(new product());
        }
        ko.applyBindings(new products());
    </script>
</body>
</html>
